@import '@/lib/reset.scss';

.SingerList{
    @include background-color(#F3F3F3);
    .banner{
        @include rect(100%, 376px);
        background: url(https://y.gtimg.cn/mediastyle/yqq/img/bg_singer.jpg)
    }
    .list{
        a{
            @include text-color(#000);
        }
        ul:first-child{
            display: flex;
            @include justify-content(space-between);
            @include rect(1055px, 43px);
            margin: 66px auto 0;
            li{
                a{
                    display: block;
                    @include rect(26px, 26px);
                    @include text-align(center);
                    @include line-height(26px);
                    &:hover{
                        @include text-color(#31c27c);
                    }
                }
            }
            li:first-child{
                a{
                    @include rect(44px, 26px);
                }
            }
        }
        .active{
            @include text-color(#fff);
            @include background-color(#31c27c);
            &:hover{
                color:#fff !important;
            }
        }
    }
    .ImgList{
        @include rect(1220px, 500px);
        margin: 25px auto;
        ul{
            display: flex;
            @include justify-content(space-between);
            @include flex-wrap(wrap);
            li{
                @include rect(224px, 245px);
                img{
                    display: block;
                    @include rect(140px, 140px);
                    border-radius: 50%;
                    margin: 25px auto 25px;
                }
                p{
                    @include font-size(18px);
                    text-align: center;
                }
            }
        }
    }
    .NameList{
        @include rect(1220px, 576px);
        margin: 10px auto;
        ul{
            display: flex;
            @include justify-content(space-between);
            @include flex-wrap(wrap);
            li{
                @include rect(244px, 36px);
                @include font-size(14px);
                line-height: 36px;
                cursor: pointer;
                &:hover{
                    @include text-color(#31c27c);
                }
            }
        }
    }
}